<template>
    <div>
        <el-cascader-panel v-model="form.pca" :props="addressProps" :options="pca" @change="findData"></el-cascader-panel>
        {{form}}

        <div style='position:relative'>
            <!-- 表单 -->
            <div style="width:50%;margin-top:10px;display:inline-block;">
                <el-form ref="form" :model="form" label-width="80px">
                    <el-form-item label="确诊">
                        <el-input v-model="form.confirmed"></el-input>
                    </el-form-item>
                    <el-form-item label="疑似">
                        <el-input v-model="form.suspected"></el-input>
                    </el-form-item>
                    <el-form-item label="死亡">
                        <el-input v-model="form.dead"></el-input>
                    </el-form-item>
                    <el-form-item label="治愈">
                        <el-input v-model="form.cure"></el-input>
                    </el-form-item>
                    <el-form-item label="重症">
                        <el-input v-model="form.severe"></el-input>
                    </el-form-item>
                    <el-form-item label="境外输入">
                        <el-input v-model="form.outside"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button @click="toSaveHandler">提交</el-button>
                    </el-form-item>
                </el-form>
            </div>
        </div>
    </div>
</template>

<script>
import pca from '@/assets/pca.json'
import qs from 'qs'
import moment from 'moment'
import { mapActions , mapState } from 'vuex'
export default {
    data() {
        return {
            pca,
            form: {},
            form: {},
            addressProps:{children:'children',label:'name',value:'name'},
            params: {
                page: 1,
                pageSize: 1000
            }

        }
    },
    computed: {
        ...mapState("data",["dataList"])
    },
    created() {
        // 分页查询所疫情信息
        this.pageQueryData(this.params)

    },
    methods: {
        ...mapActions("data",['SaveOrUpdate','pageQueryData']),
        // 查询某地区当天是否录入数据
        findData(val) {
        // val[2]
        // moment(new Date()).format('YYYY-MM-DD')
        let params = {
            page: 1,
            pageSize: 1,
            area: val[2],
            inputTime: moment(new Date()).format("YYYY-MM-DD"),
        };
        this.pageQueryData(params).then((res)=>{
            if(this.dataList.total > 0) {
                //   修改
                this.form = res.data.list[0]
                this.form.pca = [this.form.province,this.form.city,this.form.area]
            }
        })
        },

        // 保存提交
        toSaveHandler() {
            // 克隆数据
            var data = Object.assign({},this.form)
            this.form.country = '中国'
            this.form.province = this.form.pca[0]
            this.form.city = this.form.pca[1]
            this.form.area = this.form.pca[2]
            delete this.form.pca;

            this.SaveOrUpdate(this.form).then((res) => {
                // 将res放入提示框
                this.$router.push({
                    path: "/data/dataList",
                });
            });
        }
    }
}
</script>